<template>
      <el-dialog title="语录" width="760px" height="450px" :visible.sync="allText1" class="quotations" @close="dialogClose">
    <el-container>
      <el-container>
        <el-aside width="180px">
          <div v-for="g in this.textGroupList" :key="g.id" :class="['g_items', selectedGroupId == g.id ? 'active' : '']" @click.stop.prevent="selectGroups(g)">
            <img :src="GroupImg" />
            <span class="g_names">{{ g.name }}</span>
          </div>
        </el-aside>
        <el-container style="height: 400px">
          <el-main>
            <div class="search_Wrap">
              <el-input class="search_options" @keyup.enter.native="searchKey" placeholder="搜索语录关键字" suffix-icon="el-icon-search" v-model="keywords">
              </el-input>
              <el-date-picker class="picker_dates" v-model="quotationsDate" @change="quotationsDateChange" type="date" placeholder="选择日期">
              </el-date-picker>
            </div>
            <div class="mian_list">
              <div class="m_item" v-for="(item, index) in quotationsList" :key="index" @mouseenter.stop.prevent="mouseOnQuotation(item)" @mouseleave.stop.prevent="mouseLeaveQuotation(item)">
                <div class="m_title">
                  <p>
                    <span style="color: #fa7500; margin-right: 10px">{{
                        item.CREATENAME
                      }}</span>收藏于 {{ item.CREATEDATE }}
                  </p>
                  <span class="m_deldeteIcon" @click.stop.prevent="deleteFromGroupQuotations(item)" v-show="my_position == 1 && item.SHOWDELETE"><i class="el-icon-delete"></i></span>
                </div>
                <div class="m_i_content" v-for="(text, index) in item.VALUE" :key="index">
                  <div class="m_c_left">
                    <img :src="
                          !$isNull(text.head)
                            ? `${$store.state.headPathUrl}${text.id}${text.head}.PNG`
                            : `static/image/home/person_${
                                text.gender == 2 ? 2 : 1
                              }.png`
                        " alt="" class="m_imgs" :onerror="defaultImg" />
                    <!-- <img :src="!$isNull(text.head)&&!$isNull(text.headPath)?(text.headPath):`static/image/home/person_${text.gender==2?2:1}.png`" alt="" class="m_imgs" :onerror="defaultImg"> -->
                    <div class="m_details">
                      <p class="m_names">{{ text.sendName }}</p>
                      <p class="m_text">{{ text.text }}</p>
                    </div>
                  </div>
                  <div class="m_c_right">{{ text.time }}</div>
                </div>
              </div>
            </div>
          </el-main>
          <el-footer>
            <el-pagination background layout="prev, pager, next" @prev-click="prevQuotations" @next-click="nextQuotations" :current-page="currentPage" :page-count="quotationsTotal">
            </el-pagination>
          </el-footer>
        </el-container>
      </el-container>
    </el-container>
  </el-dialog>
</template>
           
<script>
// import imgsrc from '../../../static/image/home/groupInfo.png'

export default {
  computed: {
    allText1: {
      get() {
        return this.allText;
      },
      set(val) {
        this.$emit("update:allText", val);
      },
    },
  },
  props: [
    "selectedGroupId",
    "allText",
    "textGroupList",
    "ws",
    "quotationsList",
    "my_position",
    "defaultImg",
    "currentPage",
    "quotationsTotal",
  ],
  data() {
    return {
      keywords: "",
      searchDate: "",
      quotationsDate: "",
      GroupImg: require("../../../static/image/home/groupInfo.png"),
    };
  },
  methods: {
    // 语录上一页
    prevQuotations(page) {
      let key = this.selectedGroupId;
      let pageData = {
        pageSize: 30,
        pageNumber: this.currentPage == 1 ? 1 : this.currentPage - 1,
      };
      this.ws.send(
        this.$publicSend(key, "1.500", "1.1.2008", {
          groupId: key,
          startTime: this.searchDate,
          endTime: this.searchDate,
          page: pageData,
        })
      );
      console.lgo("当前页码", page);
    },
    // 语录下一页
    nextQuotations(page) {
      console.lgo("当前页码", page);
      let key = this.selectedGroupId;
      let pageData = {
        pageSize: 30,
        pageNumber: this.currentPage + 1,
      };
      this.ws.send(
        this.$publicSend(key, "1.500", "1.1.2008", {
          groupId: key,
          startTime: this.searchDate,
          endTime: this.searchDate,
          page: pageData,
        })
      );
      console.lgo("当前页码", page);
    },
    // 全部语录中的删除语录
    deleteFromGroupQuotations(item) {
      let arr = item.VALUE;
      let idArr = [];
      arr.map((e) => {
        idArr.push(e.id);
        console.log(e.id, "e.ide.ide.ide.id");
      });
      let ids = idArr.join(",");
      console.log(ids, "idssss");
      this.$emit("delteleQuotation", ids);
      // this.delteleQuotation(ids);
    },
    // 重点语录鼠标移出
    mouseLeaveQuotation(item) {
      this.$set(item, "SHOWDELETE", false);
      this.$forceUpdate();
    },
    // 重点语录鼠标移入
    mouseOnQuotation(item) {
      this.$set(item, "SHOWDELETE", true);
      this.$forceUpdate();
    },
    // 按时间筛选语录
    quotationsDateChange() {
      let key = this.selectedGroupId;
      if (!this.quotationsDate) {
        this.searchDate = "";
        let page = {
          pageSize: 30,
          pageNumber: 1,
        };
        this.ws.send(
          this.$publicSend(key, "1.500", "1.1.2008", { groupId: key, page })
        );
        return;
      }
      let year = this.quotationsDate.getFullYear();
      let month =
        this.quotationsDate.getMonth() + 1 < 10
          ? `0${this.quotationsDate.getMonth() + 1}`
          : this.quotationsDate.getMonth() + 1;
      let date =
        this.quotationsDate.getDate() < 10
          ? `0${this.quotationsDate.getDate()}`
          : this.quotationsDate.getDate();
      let timeStart = `${year}-${month}-${date}`;
      this.searchDate = timeStart;
      let page = {
        pageSize: 30,
        pageNumber: 1,
      };
      this.ws.send(
        this.$publicSend(key, "1.500", "1.1.2008", {
          groupId: key,
          startTime: timeStart,
          endTime: timeStart,
          page,
        })
      );
    },
    // 全部语录搜索关键字
    searchKey() {
      console.log("搜索事件触发");
      let page = {
        pageSize: 30,
        pageNumber: 1,
      };
      let key = this.selectedGroupId;
      if (!this.keywords) {
        this.ws.send(
          this.$publicSend(key, "1.500", "1.1.2008", {
            groupId: key,
            page: page,
          })
        );
        return;
      }
      this.ws.send(
        this.$publicSend(key, "1.500", "1.1.2008", {
          groupId: key,
          page: page,
          name: this.keywords,
        })
      );
    },
    // 群语录选中群
    selectGroups(item) {
      this.quotationsDate = "";
      this.$emit("update:selectedGroupId", item.id);
      // this.selectedGroupId = item.id;
      let key = item.id;
      let page = {
        pageSize: 30,
        pageNumber: 1,
      };
      this.ws.send(
        this.$publicSend(key, "1.500", "1.1.2008", { groupId: key, page: page })
      );
    },
    dialogClose() {
      this.$emit("update:allText", false);
      this.$emit("dialogClose");
    },
  },
};
</script>
<style scoped>
</style>